﻿<%@ Page Language="C#" MasterPageFile="~/masDefault.master" AutoEventWireup="true" CodeFile="ProductDetail.aspx.cs" Inherits="ProductDetail" %>
<%@ Import Namespace="CommonTagTime" %>
<%@ Import Namespace="CommonTagTime.ModelObject" %>
<%@ Register Src="UserControl/ucRelatedProductItem.ascx" TagName="ucRelatedProductItem" TagPrefix="uc1" %>
<%@ Register Assembly="CommonTagTime" Namespace="CommonTagTime.PagerControl.stylePager2" TagPrefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <script src="/scripts/Popup.js" type="text/javascript"></script>
    <script src="/scripts/common.js" type="text/javascript"></script>
    <script src="/scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="/scripts/jquery.lightbox.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="/scripts/jquery.lightbox.css" media="screen" />
    <script type="text/javascript">
        $(function () {
            $('#divDocument a').lightBox();
        });
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="content" runat="Server">
    
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <div>
        <h1><%=objProduct.SKU + " - " + Server.HtmlEncode(objProduct.Name)%></h1>
        <div class="box-content2">
    <div id="productDetailContent">
        <div id="productDetailImageBox">
            <div id="productDetailImage">
                <div class="dtImage">
                    <asp:Literal ID="ltrProductImage" runat="server" Text=""></asp:Literal>
                </div>
            </div>
            <%if ((!isUserNoimage) || objProduct.Video != string.Empty) %>
            <table id="productDetailImageTab">
                <tr>
                    <%if (!isUserNoimage)
                      { %>
                    <td class="View">
                        <a href="javascript:void(0);" onclick="ViewLargeImage();">View Larger</a>
                    </td>
                    <%}
              if (objProduct.Video != string.Empty)
              { %>
                    <td class="Video">
                        <a href="javascript:void(0);" onclick="ViewVideo();">Play Video </a>
                    </td>
                    <%} %>
                </tr>
            </table>

            <div id="productSmallImage">
                <asp:Literal ID="ltrSmallImage" runat="server"></asp:Literal>
            </div>
        </div>
        
        <div id="productDetailDesc">
            
            <div class="price"><%= SitePage.ShowDetailPrice(objProduct.WasPrice, objProduct.NowPrice)%></div>
             <%if (objProduct.Site.Length > 0)
            { %>
            <div class="site">Hàng từ <%=clsString.BBCodeToHTML(objProduct.Site, true, false)%></div>
            <% } %>
            

            <p><%=objProduct.ShortDescription %></p>
        </div>
        <div id="divDocument">
            <asp:Repeater ID="rptDocument" runat="server" OnItemDataBound="rptDocument_ItemDataBound">
                <HeaderTemplate>
                    <div class="header">Sản phẩm cùng loại</div>
                </HeaderTemplate>
                <ItemTemplate>
                    <div class="box">
                        <table cellpadding="0" cellspacing="0">
                            <tr>
                                <td><a id="aImg" runat="server"></a></td>
                                <asp:Literal ID="ltrInfo" runat="server"></asp:Literal>
                            </tr>
                        </table>
                        <asp:Literal ID="ltrName" runat="server"></asp:Literal>
                    </div>
                </ItemTemplate>
            </asp:Repeater>
        </div>

        <div class="clearleft"></div>
        
        <%if (!string.IsNullOrEmpty(objProduct.Color) || !string.IsNullOrEmpty(objProduct.Material) || !string.IsNullOrEmpty(objProduct.MadeIn) || !string.IsNullOrEmpty(objProduct.Size))
              {
                  %>
                  <center>
            <table id="attribute" cellpadding="0" cellspacing="0">
                <tr>
                    <th>Màu sắc</th>
                    <th>Chất liệu</th>
                    <th>Size</th>
                    <th>Xuất xứ</th>
                </tr>
                <tr>
                    <td class="color"><%=objProduct.Color %></td>
                    <td class="material"><%=objProduct.Material %></td>
                    <td class="size"><%=strSize %></td>
                    <td class="madein"><%=objProduct.MadeIn %></td>
                </tr>
            </table>
            </center>
            <% } %>
        <p><%=objProduct.Description %></p>
       <%if (objProduct.NoteId > 0)
              {
                  %>
                <p class="note"><u>Lưu ý:</u> <%=clsString.BBCodeToHTML(objProduct.NoteContent)%></p>
            <% } %>
    </div>


    
    <div id="productDetailRelated" runat="server">
       
         
                <%
                  if (isGenTabRelatedProduct)
                  {
                      %>
    
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                <div class="pgRelatedTop">
                                    <cc1:stylePager2 ID="pagerTop" runat="server" OnPageIndexChanging="pagerTop_PageIndexChanging"
                                        OnPageSizeChanging="pagerTop_PageSizeChanging" ShowPageSize="false" ShowViewAll="True" />
                                </div>
                                <asp:DataList ID="dalRelatedProduct" runat="server" RepeatColumns="4" ItemStyle-CssClass="listProductTD"
                                    RepeatLayout="Table" CssClass="listProductRelated" RepeatDirection="Horizontal"
                                    OnItemDataBound="dalRelatedProduct_ItemDataBound">
                                    <ItemTemplate>
                                        <asp:PlaceHolder ID="phdControlProduct" runat="server"></asp:PlaceHolder>
                                    </ItemTemplate>
                                </asp:DataList>
                                <div class="pgRelatedBottom">
                                    <cc1:stylePager2 ID="pagerBottom" runat="server" OnPageIndexChanging="pagerTop_PageIndexChanging"
                                        OnPageSizeChanging="pagerTop_PageSizeChanging" ShowPageSize="false" ShowViewAll="True" />
                                </div>
                            </ContentTemplate>
                        </asp:UpdatePanel>
         
                    <%} %>
                 
            </div>
            <div class="clear">
            </div>
            
        </div>
    </div>

    <div id="divPopUpViewImage" style="display: none; background-color: rgb(246, 246, 246);
        width: 700px;">
        <table cellspacing="0" cellpadding="0" border="0" style="margin-left: auto; margin-right: auto;">
            <tbody>
                <tr class="altTitle">
                    <td class="center" style="width: 500px;">
                        &nbsp;
                    </td>
                    <td align="center" style="width: 125px;">
                        <span class="smallest">Alternate Images</span>
                    </td>
                </tr>
                <tr valign="top">
                    <td align="center" id="idLargeImage">
                        <asp:Literal ID="ltrLargeImage" runat="server" Text=""></asp:Literal>
                        
                    </td>
                    <td id="divAlternates">
                        <div class="divAlternates center">
                            <asp:Literal ID="ltrAlternateImage" runat="server" Text=""></asp:Literal>
                        </div>
                    </td>
                </tr>
                <tr class="puClose">
                    <td align="center" colspan="2">
                        <a class="linkClosePopUp" id="lnkClosePopUpViewImage" onclick="ClosePopupViewImage()"
                            href="javascript:void(0);">Close Window</a>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <div id="divPopUpVideo" style="display: none; background-color: rgb(246, 246, 246);
        width: 810px; height:522px;">
        <table cellspacing="0" cellpadding="5" border="0" style="margin-left: auto; margin-right: auto;">
            <tbody>
              
                <tr valign="top">
                    <td align="center" id="tdVideoValue" height="480px">
                        <%=videoSrc%>
                    </td>
                </tr>
                <tr>
                    <td style="margin-top: 0px; padding-bottom: 14px;"  align="center" colspan="2">
                        <input type="hidden" id="hidVideoValue" value="<%=videoSrc %>" />
                        <a class="linkClosePopUp" id="A1" onclick="ClosePopupVideo()" href="javascript:void(0);">
                            Close Window</a>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

<div id="divOverlay" class="clipOverlay" style="display: none;">&nbsp;</div>
<div id="divBackground" class="lightbox" style="display: none;">&nbsp;</div>

<script type="text/javascript">
    var divPopUpViewImage = document.getElementById('divPopUpViewImage');
    var divPopUpVideo = document.getElementById('divPopUpVideo');
    var divBackground = document.getElementById('divBackground');
    function ViewLargeImage() {
        f_putScreen(divPopUpViewImage, divBackground, true);
    }
    function ClosePopupViewImage() {
        f_putScreen(divPopUpViewImage, divBackground, false);
    }
    function ViewVideo() {
        var src = document.getElementById('hidVideoValue').value;
        src = fixEmbeddedVideo(src);
        document.getElementById('tdVideoValue').innerHTML = src;
        f_putScreen(divPopUpVideo, divBackground, true);
        var divOverlay = document.getElementById('divOverlay');
        if (divOverlay) {
            divOverlay.style.left = divPopUpVideo.style.left;
            divOverlay.style.top = divPopUpVideo.style.top;
            divOverlay.style.height = divPopUpVideo.clientHeight - 120 + 'px';
            divOverlay.style.width = divPopUpVideo.clientWidth + 'px';
            divOverlay.style.display = '';
        }
    }
    function ClosePopupVideo() {
        f_putScreen(divPopUpVideo, divBackground, false);
        document.getElementById('divOverlay').style.display = 'none';
    }
    function ChangeTab(id) {

        if (document.getElementById('div_2'))
            document.getElementById('div_2').style.display = 'none';
        if (document.getElementById('div_3'))
            document.getElementById('div_3').style.display = 'none';


        if (document.getElementById('tb2'))
            document.getElementById('tb2').className = 'taboff';
        if (document.getElementById('tb3'))
            document.getElementById('tb3').className = 'taboff';


        if (document.getElementById('b2'))
            document.getElementById('b2').className = 'taboff_r';
        if (document.getElementById('b3'))
            document.getElementById('b3').className = 'taboff_r';

        document.getElementById('div_' + id).style.display = '';

        document.getElementById('tb' + id).className = 'tabon';
        document.getElementById('b' + id).className = 'tabon_r';
    }

    function ChangeImage(image) {

        var html = "<div style='background-image: url(&quot;" + image + "&quot;);'  class='pimgDetail'>";
        html += "        <img width='100%' height='100%' src='/App_Themes/Default/images/nobg.gif' style='border-style: none;'   alt=''></div>";
        document.getElementById('idLargeImage').innerHTML = html;

    }

                
            </script>
</asp:Content>
